import 'package:flutter/material.dart';
import '../../util/screen_util.dart';

class Progress extends StatelessWidget {
  final int current;
  final int total;

  Progress({super.key, this.current = 0, this.total = 1});

  @override
  Widget build(BuildContext context) {
    final screen = Screen(context);
    final W = 558.0;

    //
    final curTime =
        '${(current ~/ 60).toString().padLeft(2, '0')}:${(current % 60).toString().padLeft(2, '0')}';
    final totalTime =
        '${(total ~/ 60).toString().padLeft(2, '0')}:${(total % 60).toString().padLeft(2, '0')}';

    final curWidth = screen.calc((W - 18) * current / total);

    return Container(
      margin: EdgeInsets.only(top: screen.calc(30)),
      height: screen.calc(30),
      child: DefaultTextStyle(
          style: TextStyle(
            color: Colors.white.withOpacity(.6),
            fontSize: screen.calc(28),
          ),
          child: Row(
            children: [
              Container(
                margin: EdgeInsets.only(left: screen.calc(28)),
                child: Text(curTime),
              ),
              Expanded(
                child: Container(
                    height: screen.calc(30),
                    child: Stack(
                      children: [
                        Center(
                          child: Container(
                            width: screen.calc(W),
                            margin: EdgeInsets.only(
                                left: screen.calc(9), right: screen.calc(9)),
                            height: screen.calc(4),
                            color: Colors.white.withOpacity(.6),
                            child: Stack(
                              children: [
                                Container(
                                  width: curWidth,
                                  color: Colors.white.withOpacity(.8),
                                ),
                              ],
                            ),
                          ),
                        ),
                        Positioned(
                          left: curWidth,
                          top: screen.calc(6),
                          child: Container(
                            width: screen.calc(16),
                            height: screen.calc(16),
                            decoration: BoxDecoration(
                              borderRadius:
                                  BorderRadius.circular(screen.calc(16)),
                              color: Colors.white,
                            ),
                          ),
                        ),
                      ],
                    )),
              ),
              Container(
                margin: EdgeInsets.only(right: screen.calc(28)),
                child: Text(totalTime),
              ),
            ],
          )),
    );
  }
}
